<template>
	<div class="addExamMain">
		<div class="addExamContent">
			<h3 style="padding-bottom:10px;">选择复用模板</h3>
			<ul>
				<li>
					<span style="width:71px;">复用项目：</span>
					<div class="inputBox">
						<el-select v-model="copydata.id" placeholder="请选择复用考试" filterable @change="copyexamchange">
						  <el-option
							v-for="item in examlist"
							:key="item.nav5id"
							:label="item.navsname"
							:value="item.nav5id">
						  </el-option>
						</el-select>
					</div>
				</li>
				<li>请选择您要复用的数据</li>
				<li class="infosetcontentfont">
					<el-checkbox-group v-model="checkList">
						<el-checkbox  v-for="(item,index) in copymodellist" :label="item.itemCaseFlagId">{{ item.itemCaseFlagName}}</el-checkbox>
					</el-checkbox-group>
				</li>
				<li style="color:red;" v-if="attentionIshow">
					<i class="el-icon-warning-outline" style="margin-right:5px;"></i>{{attention}}
				</li>
			</ul>
			<div class="groupbutton">
				<el-button type="primary" @click="surebc">保存</el-button>
				<el-button type="primary" @click="goback">返回</el-button>
			</div>
		</div>
	</div>
</template>

<script>
import {getExamList,searchltemcaseFlagNamesByNav5ldmodel,copymodelflagebox} from '../../api/api.js'
	export default{
		props:['type'],
		data(){
			return{
				addinfo:{
					gradeId:'',
					examTime:'',
					name:'',
					subjectList:[],
					fullMark:'',
					selectScoreType:false?0:1,
					n4Id:undefined,
					n5Id:undefined
				},
				examId:[],
				examlist:[],
				attentionIshow:false,
				examdataobj:{},
				copydata:{
					id:'',
					isCopyData:false,
					isCopyStudent:false,
					isCopyTeacher:false
				},
				studentdata:{
					examId: 0,
					copyExamId: 0,
					isCopyStudent: true,
					isCopyTeacher: true
				},
				examobjcontent:{},
				examobj:{
					page:1,
					pagesize:500,
					itemname:'',
					startdate:'',
					enddate:''
				},
				copymodellist:[],
				checkList:[]
			}
		},
		mounted() {
			this.examobjcontent = JSON.parse(sessionStorage.getItem('examContent'))
			this.copyexamlist()
		},
		methods:{
			// 复用考试列表
			copyexamlist(){
				//获取列表
			    getExamList(this.examobj).then(res=>{
			        console.info(res)
					if(res.code==0){
						this.examlist = res.obj.results
						this.total = res.obj.count
					}else{
						this.$message.error(res.msg)
					}
			    })
			},
			
			copyexamchange(val){
				this.copyexamdata(val)
			},
			copyexamdata(id){
				let obj={
					nav5id:id
				}
				searchltemcaseFlagNamesByNav5ldmodel(obj).then(res=>{
				    if(res.code==0){
				        this.copymodellist = res.obj
				    }else{
						this.$message.error(res.msg)
					}
				})
			},
			surebc(){
				let obj={
					nav5id:this.examobjcontent.nav5id,
					itemcaseflagids:this.checkList
				}
				copymodelflagebox(obj).then(res=>{
					if(res.code==0){
						this.$message.success(res.msg)
						this.$emit('copyexamclick',false)
					}else{
						this.$message.error(res.msg)
					}
				})
			},
			goback(){
				this.$emit('copyexamclick',false)
			}
		}
	}
</script>

<style scoped>
	.addExamMain{
		position: fixed;
		width:100%;
		height:100%;
		background:rgba(0,0,0,0.5);
		left:0;
		top:0;
		z-index:5;
	}
	.addExamContent{
		width: 584px;
		height: auto;
		background: #FFFFFF;
		box-shadow: 0px 4px 16px 0px rgba(85,114,146,0.1);
		border-radius: 10px;
		position: fixed;
		left:50%;
		top:50%;
		transform: translate(-50%,-50%);
		z-index:2;
		box-sizing: border-box;
		padding:30px;
	}
	.addExamContent h3{
		font-size:18px;
		padding-bottom:20px;
	}
	.addExamContent ul li{
		display: flex;
		align-items: center;
		padding-bottom:14px;
		font-size:14px;
	}
	.addExamContent ul li em.looknamestudent{
		color:#0052D9;
		display: inline-block;
		margin-left:20px;
		font-weight: normal;
		cursor: pointer;
	}
	.addExamContent ul li span{
		font-size:14px;
		width:98px;
		color: #557292;
		text-align: right;
	}
	.addExamContent ul li p{
		position: relative;
	}
	.addExamContent ul li p em{
		position: absolute;
		right:10px;
		top:50%;
		transform: translateY(-50%);
		color:#295CFF;
		cursor: pointer;
	}
	.addExamContent ul li >>>.el-input__inner{
		width: 400px;
		height: 34px;
		border-radius: 10px;
		border: 1px solid #D8E4F0;
	}
	.inputBox{
		width: 400px;
	}
	.inputBox1{
		width: 300px;
	}
	.addExamContent ul li div.inputBox1 >>> .el-input__inner{
		width:300px;
		height: 34px;
		border-radius: 10px;
		border: 1px solid #D8E4F0;
	}
	.addExamContent ul li >>> .el-range__icon{
		line-height:27px;
	}
	.groupbutton{
		display: flex;
		align-items: center;
		padding-top:20px;
	}
	.groupbutton >>> .el-button{
		width: 124px;
		height: 34px;
		background: #295CFF;
		border-radius: 10px;
		font-size: 14px;
		color: #FFFFFF;
		padding:0;
	}
	.groupbutton >>> .el-button:last-child{
		background: #F2F6FB;
		border-radius: 10px;
		border: 1px solid #295CFF;
		color:#295CFF;
		margin-left:24px;
	}
	.bcontentcolor{
		font-size:14px;
		color:#295CFF;
		display: inline-block;
		margin-left:20px;
		cursor: pointer;
	}
	.el-checkbox{
		margin-right:8px;
	}
	.infosetcontentfont{
		color:#5B6371
	}
	.addExamContent ul li.infosetcontentfont span{
		width:auto;
		height: 26px;
		border-radius: 4px;
		background: #F2F6FB;
		border: 1px solid #D8E4F0;
		color:#B3B8C2;
		font-size:14px;
		text-align:left;
		line-height:26px;
		padding:0 16px 0 10px;
		margin-left:10px;
	}
	.addExamContent ul li.infosetcontentfont i{
		font-style:normal;
		color:#295CFF;
		padding:0 4px;
	}
	.infosetcontentfont >>> .el-checkbox{
		margin-bottom:12px;
	}
</style>